.dx-size-default() {
    @GENERIC_POPUP_CLOSEBUTTON_SIZE: 23px;
    @GENERIC_POPUP_CLOSEBUTTON_ICON_SIZE: 15px;

    @GENERIC_POPUP_CONTENT_PADDING: 20px;
    @GENERIC_POPUP_BUTTON_MARGIN: 0 10px;

    @GENERIC_POPUP_TOOLBAR_ITEM_SPACING: 10px;
    @GENERIC_POPUP_TOOLBARTOP_PADDING: 6px 20px;
    @GENERIC_POPUP_TOOLBARBOTTOM_PADDING: 20px;
}
.dx-size-compact() {
    @GENERIC_POPUP_CLOSEBUTTON_SIZE: 19px;
    @GENERIC_POPUP_CLOSEBUTTON_ICON_SIZE: 11px;

    @GENERIC_POPUP_CONTENT_PADDING: 10px;
    @GENERIC_POPUP_BUTTON_MARGIN: 0 5px;

    @GENERIC_POPUP_TOOLBAR_ITEM_SPACING: 5px;
    @GENERIC_POPUP_TOOLBARTOP_PADDING: 2px 10px;
    @GENERIC_POPUP_TOOLBARBOTTOM_PADDING: 10px;
}
@GENERIC_POPUP_CLOSEBUTTON_OFFSET: (@GENERIC_POPUP_CLOSEBUTTON_SIZE - @GENERIC_POPUP_CLOSEBUTTON_ICON_SIZE) / 2;

@GENERIC_POPUP_TOOLBAR_HEIGHT: @GENERIC_BASE_INLINE_WIDGET_HEIGHT;
@GENERIC_POPUP_TOOLBAR_LABEL_FONT_SIZE: @GENERIC_M_FONT_SIZE;

@GENERIC_POPUP_CLOSEBUTTON_BORDER_WEIGHT: @GENERIC_BASE_BORDER_WIDTH;
@GENERIC_POPUP_CLOSEBUTTON_ICON_CONTAINER_SIZE: @GENERIC_POPUP_CLOSEBUTTON_SIZE - @GENERIC_POPUP_CLOSEBUTTON_BORDER_WEIGHT * 2;

@GENERIC_MOBILE_POPUP_CLOSEBUTTON_SIZE: 37px;
@GENERIC_MOBILE_POPUP_CLOSEBUTTON_ICON_SIZE: 15px;
@GENERIC_MOBILE_POPUP_CLOSEBUTTON_OFFSET: (@GENERIC_MOBILE_POPUP_CLOSEBUTTON_SIZE - @GENERIC_MOBILE_POPUP_CLOSEBUTTON_ICON_SIZE) / 2;
@GENERIC_MOBILE_POPUP_CLOSEBUTTON_ICON_CONTAINER_SIZE: @GENERIC_MOBILE_POPUP_CLOSEBUTTON_SIZE - @GENERIC_POPUP_CLOSEBUTTON_BORDER_WEIGHT * 2;

.dx-popup-wrapper {
    & > .dx-overlay-content {
        border: 1px solid @overlay-border-color;
        background: @overlay-content-bg;
        .box-shadow(0 6px 12px @overlay-content-shadow-color);
        .border-radius(@popup-border-radius);
    }

    & > .dx-popup-fullscreen {
        .border-radius(0);
    }
}

.dx-popup-title {
    position: relative;
    padding: @GENERIC_POPUP_TOOLBARTOP_PADDING;
    min-height: 28px;
    border-bottom: 1px solid @popup-title-border-color;
    background: @popup-title-bg;
    color: @popup-title-color;

    &.dx-toolbar {
        .dx-toolbar-sizing(@GENERIC_POPUP_TOOLBAR_HEIGHT, @GENERIC_POPUP_TOOLBARTOP_PADDING, @GENERIC_POPUP_TOOLBAR_LABEL_FONT_SIZE, @GENERIC_POPUP_TOOLBAR_ITEM_SPACING );
        .box-shadow(none);
    }

    .dx-closebutton {
        display: block;

        .dx-button-content {
            padding: 0;
        }

        .dx-icon {
            .box-sizing(border-box);
        }

        .dx-button-styling();
        .dx-button-styling-clear();

        .dx-closebutton-sizing(@size, @offset, @iconSize, @iconContainerSize) {
            width: @size;
            height: @size;
            margin: 0 -@offset 0 @offset;

            .dx-rtl & {
                margin: 0 @offset 0 -@offset;
            }

            .dx-icon {
                .dx-icon-sizing(@iconSize, @iconContainerSize);
            }
        }

        .dx-closebutton-sizing(
            @GENERIC_POPUP_CLOSEBUTTON_SIZE,
            @GENERIC_POPUP_CLOSEBUTTON_OFFSET,
            @GENERIC_POPUP_CLOSEBUTTON_ICON_SIZE,
            @GENERIC_POPUP_CLOSEBUTTON_ICON_CONTAINER_SIZE);

        .dx-device-mobile & {
            .dx-closebutton-sizing(
                @GENERIC_MOBILE_POPUP_CLOSEBUTTON_SIZE,
                @GENERIC_MOBILE_POPUP_CLOSEBUTTON_OFFSET,
                @GENERIC_MOBILE_POPUP_CLOSEBUTTON_ICON_SIZE,
                @GENERIC_MOBILE_POPUP_CLOSEBUTTON_ICON_CONTAINER_SIZE);
        }
    }
}

.dx-popup-content {
    padding: @GENERIC_POPUP_CONTENT_PADDING;

    & > .dx-button {
        margin: @GENERIC_POPUP_BUTTON_MARGIN;
    }
}

.dx-popup-bottom {
    background: @popup-bottom-bg;
    color: @popup-bottom-color;

    &.dx-toolbar {
        .dx-toolbar-sizing(
            @GENERIC_POPUP_TOOLBAR_HEIGHT,
            @GENERIC_POPUP_TOOLBARBOTTOM_PADDING,
            @GENERIC_POPUP_TOOLBAR_LABEL_FONT_SIZE,
            @GENERIC_POPUP_TOOLBAR_ITEM_SPACING
        );
    }

    .dx-button {
        min-width: 100px;
    }
}

.dx-popup-content.dx-dialog-content {
    min-width: 220px;
    padding: @GENERIC_POPUP_CONTENT_PADDING;
}

.dx-dialog-message {
    padding: 0;
}
